<div class="all_list">    
    <div class="list2">
        <img src="../../static/img/sales/Redesign/2.png" alt="">
    </div>
    <div class="list3">
        <img src="../../static/img/sales/Redesign/3.png" alt="">
    </div>    
    <div class="list4">
        <img src="../../static/img/sales/Redesign/4.png" alt="">
    </div>
    <div class="list5">
        <img src="../../static/img/sales/Redesign/5.png" alt="">
    </div>
    <div class="list6">        
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <img src="../../static/img/baobao/10.png" />
                </div>
                <div class="swiper-slide">
                    <img src="../../static/img/baobao/10.png" />
                </div>
                <div class="swiper-slide">
                    <img src="../../static/img/baobao/10.png" />
                </div>
            </div>
            <h3>海飞丝80ml二合一洗发水</h3>
            <div class="price">
                <p>宝店客价：
                    <span class="b-price">46</span>元</p>
                <p class="s-price">市场价：169.00</p>
            </div>
        </div>
    </div>
    <div class="list7">
        <img src="../../static/img/sales/Redesign/7.png" alt="">
    </div>
    <div class="list8">
        <img src="../../static/img/sales/Redesign/8.png" alt="">
    </div>
    <div class="list9">
        <img src="../../static/img/sales/Redesign/9.png" alt="">
    </div>
</div>
<div class="bottom">
    <img src="../../static/img/sales/Redesign/bgd3.jpg" alt="">
</div>
<a href="#/introduce_detail">
    <img class="footer" src="../../static/img/sales/Redesign/footer.png" alt="">
</a>

<style>
    .introduce_list {
        padding-bottom: 110px;          
        -webkit-overflow-scrolling: touch;   
    }
    /* 注意：background-attachment:fixed，在安卓中没问题，但是ios无效 */
    .introduce_list:before{
        content: ' ';
        position: fixed;
        z-index: -1;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: url(../../static/img/sales/Redesign/bgd2.jpg) center 0 no-repeat;
        background-size: cover;
    }

    div[class^=list] {
        height: 100%;
    }

    .bottom{
        position: fixed;
        left: 0;
        bottom: 4.2rem;
        width: 100%;
        height: 1.45rem;
        background: transparent;
        z-index: 999;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .bottom>img{
        height: 1.45rem;
    }

    .footer {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        background: transparent;
        z-index: 999;
    }

    .swiper-slide {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .swiper-slide>img {
        width: 60%;
    }

    .swiper-container {
        color: #fbc994;
        text-align: center;
    }

    .swiper-container>h3 {
        margin: 10px 0 0 0;
    }

    .swiper-container>p>span {
        font-size: 2.09rem;
    }

    .b-price{
        font-size: 3rem;
    }

    .s-price {
        margin: -.1rem 0 0 7rem;
        font-size: .65rem;
        text-decoration: line-through;
    }
</style>